import 'package:flutter/material.dart';
import 'package:flutter_learn_demo/define/define_circle.dart';
import 'package:flutter_learn_demo/define/define_circle_progress.dart';
import 'package:flutter_learn_demo/define/define_row.dart';
import 'package:flutter_learn_demo/sharedata/share_data_widget_test_case.dart';

class Home extends StatefulWidget {

  const Home({super.key});
  @override
  State createState() => HomeState();

}

class HomeState extends State<Home> {

  Color _stateColor = Colors.indigo;


  @override
  Widget build(BuildContext context) {
     return Column(
        children: [
          DefineRow(),

          Container(
               margin: const EdgeInsets.only(top: 10,left: 5,right: 5),
               height: 60,
               color: Colors.cyan,
               child: const Center(
                   child: Text(
                     'data',
                      style: TextStyle(
                         color: Colors.red,
                         fontSize: 24
                      ),
                   ),
               )
             ),

          //点击水波纹效果
          InkWell(
             child:Container(
              margin: const EdgeInsets.only(top: 10,left: 5,right: 5),
              height: 60,
              color: Colors.deepPurple,
              child: const Center(
                child: Text(
                  'flutter',
                  style: TextStyle(
                      color: Colors.green,
                      fontSize: 24
                  ),
                ),
              )
            ),
            onTap: () {
               //从底部弹出BottomSheet
               Scaffold.of(context).showBottomSheet((context) => Container(
                   height: 100,
                   color: Colors.indigoAccent,
                   child: const Center(
                     child: Text(
                       'showBottomSheet',
                       style: TextStyle(
                           color: Colors.green,
                           fontSize: 24
                       ),
                     ),
                   )
               ));
            },
          ),

          //水平布局
          Row(
            children: [
              Container(
                  margin: const EdgeInsets.only(top: 10,left: 5,right: 5),
                  width: 100,
                  height: 60,
                  color: Colors.amberAccent,
                  child: const Center(
                    child: Text(
                      'row0',
                      style: TextStyle(
                          color: Colors.black54,
                          fontSize: 24
                      ),
                    ),
                  )
              ),
              Container(
                  margin: const EdgeInsets.only(top: 10,left: 5,right: 5),
                  width: 200,
                  height: 60,
                  color: Colors.red,
                  child: const Center(
                    child: Text(
                      'row1',
                      style: TextStyle(
                          color: Colors.cyanAccent,
                          fontSize: 24
                      ),
                    ),
                  )
              ),
            ],
          ),

          //流动布局
          Wrap(
            spacing:  4.0,//水平间距
            runSpacing: 0.0,//垂直间距
            alignment: WrapAlignment.start,
            children: const [
              Chip(
                  label: Text("Center"),
                  avatar: CircleAvatar(backgroundColor: Colors.indigoAccent,child: Text('A'),),
              ),

              Chip(
                  label: Text("Start"),
                  avatar: CircleAvatar(backgroundColor: Colors.indigoAccent,child: Text('B'),),
              )
            ],
          ),

          //点击事件
          GestureDetector(
            child: Container(
                margin: const EdgeInsets.only(top: 10,left: 5,right: 5),
                height: 60,
                color: _stateColor,
                child: const Center(
                child: Text(
                  'gradient',
                  style: TextStyle(
                    color: Colors.green,
                    fontSize: 24
                  ),
                ),
              )
           ),
            onTap: () {},
            onTapDown: (down) {
               setState(() {
                   _stateColor = Colors.redAccent;
               });
            },
            onTapUp:(up) {
              setState(() {
                _stateColor = Colors.indigo;
              });
            },
          ),

          //自定义容器
          Container(
            alignment: Alignment.centerLeft,
            margin: const EdgeInsets.only(top: 10,left: 5),
            child: const DefineCircle(),
          ),

         //const SizedBox(height: 10,),

         //点击水波纹效果
          Container(
            margin: const EdgeInsets.only(top: 10,left: 5,right: 5),
            height: 30,
            child:
              Material(
               child: Ink(
                 decoration: BoxDecoration(
                   color:Colors.yellow,
                   borderRadius: BorderRadius.circular(10),
                 ),
                 child: InkWell(
                  borderRadius: BorderRadius.circular(10),
                  onTap: () {
                    print("onTap---object");
                  },
                  child: const Center(child: Text('水波纹',style: TextStyle(color: Colors.blue,fontSize: 15),textAlign: TextAlign.center,),
                ),
              ),
            ),
           ),
          ),

          const SizedBox(height: 10,),
          //垂直布局  默认居中显示
          //const DefineCircleProgress(circleRadius: 30, currentDegree: 245),
          const ShareDataWidgetTestCase(),

        ],
     );
  }
}